<template>
  <DetailStructure title="案例展示" first-sentence="专注地理信息，" second-sentence="面向政府、企业和高校提供一站式地理信息解决方案。" :bg="displayBg">

  </DetailStructure>

  <div class="dmap-container">
    <ul class="dmap-wrapper">
      <li class="dmap" v-for="item in dmapList" :key="item">
        <div class="dmap-title">{{item.title}}</div>
        <div class="dmap-section">

        </div>
      </li>
    </ul>
  </div>
</template>

<script setup>
  import displayBg from '@/assets/imgs/display/displayBg.jpg';
  import DetailStructure from "@/components/common/DetailStructure.vue";
  import {map25List} from "@/utils/data.js";

  const dmapList = map25List;

</script>

<style lang="scss" scoped>
  .dmap-container{
    width: 100%;
    height: 100%;
    background: #eeeeee;
    .dmap-wrapper{
      width: 1200px;
      margin: 0 auto;
      padding: 30px 0;
      column-count: 3;
      column-gap: 10px;

      .dmap{
        width: 1200px;
        margin:0 auto;
        .dmap-title{
          font-size: 28px;
          font-weight: bold;
          text-align: center;
          padding-top: 30px;
          color: #1d74bb;
        }
      }


    }
  }
</style>
